import React from 'react'
import { Modal, Button, Form, Input, message } from 'antd';
import { useDispatch, useSelector } from "umi"
import { adduser } from "../http/management.js"
export default function managementUseradd(props) {
    const [form] = Form.useForm();
    const dispatch = useDispatch()
    const isModalVisible = useSelector(state => state.maModels.active)
    const handleOk = () => {
        dispatch({
            type: 'maModels/changestatus',
            payload: false
        })
    };

    const handleCancel = () => {
        dispatch({
            type: 'maModels/changestatus',
            payload: false
        })
    };

    const onFinish = async (values) => {
        const res = await adduser(
            values
        )
        console.log(res)
        if (res.code == 200) {
            props.getdata()
            dispatch({
                type: 'maModels/changestatus',
                payload: false
            })
            message.success('新增成功')
            form.resetFields();
        } else {
            message.error('新增失败')
        }

    };

    return (
        <>
            <Modal title="新增用户" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
                <Form
                    name="basic"
                    labelCol={{
                        span: 6,
                    }}
                    wrapperCol={{
                        span: 16,
                    }}
                    form={form}
                    onFinish={onFinish}
                >
                    <Form.Item
                        label="账户名"
                        name="account"
                        rules={[
                            {
                                required: true,
                                message: '请输入您的用户名!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="密码"
                        name="password"
                        rules={[
                            {
                                required: true,
                                message: '请输入您的密码!',
                            },
                        ]}
                    >
                        <Input.Password />
                    </Form.Item>

                    <Form.Item
                        label="真实姓名"
                        name="realname"
                        rules={[
                            {
                                required: true,
                                message: '请输入您的真实姓名!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        label="手机号"
                        name="telephone"
                        rules={[
                            {
                                required: true,
                                message: '请输入您的手机号!',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        wrapperCol={{
                            offset: 10,
                            span: 10,
                        }}
                    >
                        <Button type="primary" htmlType="submit">
                            提交
                        </Button>
                    </Form.Item>
                </Form>
            </Modal>
        </>
    )
}
